<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title></title>
</head>
<body>
<div th:fragment="myCenter">
    <div class="row border-bottom white-bg dashboard-header sk-loading">
        <div class="col-md-3" id="index_center_mytodo">
            <h2>待办事项</h2>
            <p>您没有待办事项。</p>
            <ul class="list-group clear-list m-t">

            </ul>
        </div>
        <div class="col-md-6">
            <div class="flot-chart dashboard-chart">
                <div class="flot-chart-content" id="flot-dashboard-chart"></div>
            </div>
            <div class="row text-left">
                <div class="col">
                    <div class=" m-l-md">
                        <span class="h5 font-bold m-t block">300</span>
                        <small class="text-muted m-b block">报销单总数</small>
                    </div>
                </div>
                <div class="col">
                    <span class="h5 font-bold m-t block">51</span>
                    <small class="text-muted m-b block">待预约报账</small>
                </div>
                <div class="col">
                    <span class="h5 font-bold m-t block">249</span>
                    <small class="text-muted m-b block">已完成报销单数</small>
                </div>

            </div>
        </div>
        <div class="col-md-3">
            <div class="widget style1">
                <div class="row">
                    <div id="weather-v2-plugin-standard"></div>
                    <script>
                        WIDGET = {
                            CONFIG: {
                                "layout": 2,
                                "width": "230",
                                "height": "270",
                                "background": 5,
                                "dataColor": "4A4A4A",
                                "borderRadius": 5,
                                "key": "qwyW7jFP8m"
                            }
                        }
                    </script>
                    <script src="https://apip.weatherdt.com/standard/static/js/weather-standard-common.js?v=2.0"></script>
                </div>
            </div>
        </div>
    </div>

    <div class="wrapper wrapper-content">
        <div class="row">
            <div class="col-lg-6">
                <div class="ibox ">
                    <div class="ibox-title">
                        <h5>通知公告 </h5>
                    </div>
                    <div class="ibox-content">
                        <div class="table-responsive">
                            <table id="center_infoTable" class="table table-striped"></table>
                        </div>

                    </div>
                </div>
            </div>

            <div class="col-lg-6">
                <div class="ibox ">
                    <div class="ibox-title">
                        <h5>使用帮助 </h5>
                    </div>
                    <div class="ibox-content">
                        <div class="table-responsive">
                            <table id="center_infoTable_sybz" class="table table-striped"></table>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
    <script id="index_center_mytodo_tmpl" type="text/x-jquery-tmpl">
        {{each(i,todo) mytodo}}
        <li class="list-group-item {{if i==0}}fist-item{{/if}}">
            <span class="label ${todo.className}">${i+1}</span>
            <a href="javascript:" data-url="${todo.url}" data-frame="${todo.inFrame}" data-name="${todo.name}" onclick="todoPage(this)">${todo.title}</a>
            <span class="float-right">${todo.count}</span>
        </li>
        {{/each}}


    </script>
    <script type="text/javascript">
        $(function () {
            myTodo();
            centerData();
        })

        function todoPage(e) {
            $('.page-heading').hide()
            $('#index_center').empty()
            if (e.dataset.frame == 'true') {
                $('#index_center').html(`<iframe onload="iframeLoad(this)" src="/portal/portal_index2.html?url=${e.dataset.url}" style="width: 100%; height: 100%;" frameborder='0' border='1'></iframe>`);
            } else {
                centerLoad(e.dataset.url, undefined, e.dataset.name, true, true)
            }
        }

        function myTodo() {
            $('#index_center_mytodo ul').empty()
            $.myGet({
                url: `/myTodo`,
                success: function (data) {
                    if (data && data.code === 0) {
                        let mytodo = [];
                        for (let key in data.todo) {
                            if (data.todo[key] > 0) {
                                let title = "";
                                let url = "";
                                let inFrame = true;
                                let name = "";
                                if (key == 'spending') {
                                    title = "待审批支出申请";
                                    url = "/portal/process/myTodoNew.html&dKey=spending";
                                } else if (key == 'expense') {
                                    title = "待审签报销单据";
                                    url = "/portal/process/myTodoNew.html&dKey=expense";
                                } else if (key == 'repay') {
                                    title = "待审签还款单据";
                                    url = "/portal/process/myTodoNew.html&dKey=repay";
                                } else if (key == 'appoint') {
                                    title = "待复核报销单据";
                                    url = "/portal/process/myTodoNew.html&dKey=appoint";
                                } else if (key == 'toAppoint') {
                                    title = "待报账报销单据";
                                    url = "/portal/appoint/myAppoint.html";
                                } else if (key == 'budgetToAudit') {
                                    title = "待审核预算申请";
                                    url = "/portal/budget/budgetDetailListForAudit.html";
                                } else if (key == 'toExpense') {
                                    title = "待报销请示单";
                                    url = "/web/pz/cur/pzcurmain-toexpense";
                                    inFrame = false;
                                    name = "我要报销";
                                }
                                let className = "";
                                let index = mytodo.length % 5;
                                switch (index) {
                                    case 0:
                                        className = "label-success";
                                        break;
                                    case 1:
                                        className = "label-info";
                                        break;
                                    case 2:
                                        className = "label-primary";
                                        break;
                                    case 3:
                                        className = "label-default";
                                        break;
                                    case 4:
                                        className = "label-danger";
                                        break;
                                }
                                mytodo.push({
                                    title: title,
                                    count: data.todo[key],
                                    className: className,
                                    url: url,
                                    inFrame: inFrame,
                                    name: name
                                })
                            }
                        }
                        if (mytodo.length > 0) {
                            $('#index_center_mytodo > p').hide()
                            $('#index_center_mytodo_tmpl').tmpl({mytodo: mytodo}).appendTo($('#index_center_mytodo > ul'));
                        } else {
                            $('#index_center_mytodo > p').show()
                        }
                    } else {
                        toastr.error(data.msg, '操作失败')
                    }
                }
            })
        }

        function centerData() {
            var data1 = [
                [0, 4], [1, 8], [2, 5], [3, 10], [4, 4], [5, 16], [6, 5], [7, 11], [8, 6], [9, 11], [10, 30], [11, 10], [12, 13], [13, 4], [14, 3], [15, 3], [16, 6]
            ];
            var data2 = [
                [0, 1], [1, 0], [2, 2], [3, 0], [4, 1], [5, 3], [6, 1], [7, 5], [8, 2], [9, 3], [10, 2], [11, 1], [12, 0], [13, 2], [14, 8], [15, 0], [16, 0]
            ];
            $("#flot-dashboard-chart").length && $.plot($("#flot-dashboard-chart"), [
                    data1, data2
                ],
                {
                    series: {
                        lines: {
                            show: false,
                            fill: true
                        },
                        splines: {
                            show: true,
                            tension: 0.4,
                            lineWidth: 1,
                            fill: 0.4
                        },
                        points: {
                            radius: 0,
                            show: true
                        },
                        shadowSize: 2
                    },
                    grid: {
                        hoverable: true,
                        clickable: true,
                        tickColor: "#d5d5d5",
                        borderWidth: 1,
                        color: '#d5d5d5'
                    },
                    colors: ["#1ab394", "#1C84C6"],
                    xaxis: {},
                    yaxis: {
                        ticks: 4
                    },
                    tooltip: false
                }
            );

            $('#center_infoTable').bootstrapTable({
                pagination: true,
                sidePagination: 'server',
                url: '/portal/info/infoList.json',
                queryParams: function (param) {
                    param.childType = 'tzgg';
                    return param;
                },
                columns: [{
                    title: '#',
                    width: 15,
                    formatter: function (value, row, index) {
                        return index + 1;
                    }
                }, {
                    title: '标题',
                    field: 'title',
                    formatter: function (value, row, index) {
                        if (value.length > 40) {
                            value = value.substring(0, 40) + '...';
                        }
                        var strs = [];
                        strs.push('<a href="/portal/info/infoContent.html?id=' + row.id + '" target="_blank">' + value + '</a>');
                        if (row.isNew) {
                            strs.push('<li class="fa fa-star text-warning"></li>');
                        }
                        return strs.join('&nbsp;');
                    }
                }],
                showHeader: false,
                pageSize: 4
            });

            $('#center_infoTable_sybz').bootstrapTable({
                pagination: true,
                sidePagination: 'server',
                url: '/portal/info/infoList.json',
                queryParams: function (param) {
                    param.childType = 'sybz';
                    return param;
                },
                columns: [{
                    title: '#',
                    width: 15,
                    formatter: function (value, row, index) {
                        return index + 1;
                    }
                }, {
                    title: '标题',
                    field: 'title',
                    formatter: function (value, row, index) {
                        if (value.length > 40) {
                            value = value.substring(0, 40) + '...';
                        }
                        var strs = [];
                        strs.push('<a href="/portal/info/infoContent.html?id=' + row.id + '" target="_blank">' + value + '</a>');
                        if (row.isNew) {
                            strs.push('<li class="fa fa-star text-warning"></li>');
                        }
                        return strs.join('&nbsp;');
                    }
                }],
                showHeader: false,
                pageSize: 4
            });
        }
    </script>
</div>


</body>
</html>